import { FC } from 'react'
import ChildChildComponent from '../childchildComponent'
// import ChildChildComponent from '../childchildComponent'

// 定义props的类型接口
interface ChildProps {
    message: string
    count: number
    onButtonClick: () => void
    onMessageChange: (newMessage: string) => void
}

const ChildComponent: FC<ChildProps> = ({ message, count, onButtonClick, onMessageChange }) => {
    // const [message, setMessage] = useState(message);
    console.log("ChildComponent");
    return (
        <div>
            <input
                value={message}
                onChange={(e) => onMessageChange(e.target.value)}
                placeholder="输入新消息"
            />
            <p>收到的消息: {message}</p>
            <p>收到的数字: {count}</p>
            <button onClick={onButtonClick}>点击我</button>
            <h1>子子组件</h1>
            <ChildChildComponent message={message} count={count} />
        </div>
    )
}

export default ChildComponent